<script setup lang="ts">

import {ArrowRight} from "@element-plus/icons-vue";
import {useHistoryList} from "../hooks/useHistoryList.ts";

const {historyList} = useHistoryList()
</script>

<template>
  <div>
    <div class="history-right-top">
      <el-button class="history-button" link v-for="item in historyList" :key="item.uid">
        <div class="history-btn-control-box">
          <div class="history-type-box">
            {{ item.type }}
          </div>
          <div class="history-text-title">
           <el-text class="history-header-margin">{{ item.title }}</el-text>
          </div>
        </div>
      </el-button>
    </div>
    <div class="history-right-division"></div>
    <div class="history-right-bottom">
      <el-button link class="el-btn-dr-color">查看更多
        <el-icon class="el-icon--right">
          <ArrowRight/>
        </el-icon>
      </el-button>
    </div>
  </div>
</template>

<style scoped lang="scss">
@import "style/History";
</style>